<template>
  <div>
    <van-row gutter="20" class="title_left">
      <van-col span="8" style="padding-top: 45px">
        <a @click="back" class="back_a" style="color: white; margin-left: 10px">
          返回
        </a>
      </van-col>
      <van-col
        span="8"
        style="text-align: center; color: white; padding-top: 45px"
        >违规记录详情</van-col
      >
      <van-col span="8"></van-col>
    </van-row>
    <van-row class="topMargin">
      <van-col span="24">

        <!-- 车辆信息 -->
        <van-cell-group>
          <van-cell title="基本信息" class="bg_grey" />
          <van-cell title="车牌号" :value="cph"></van-cell>
          <van-cell title="VIN号" :value="vin"></van-cell>
          <van-cell title="来源" :value="ly"></van-cell>
          <van-cell title="机构" :value="jg"></van-cell>
          <van-cell title="使用人" :value="syr"></van-cell>
          <van-cell title="使用人手机号" :value="sjh"></van-cell>
        </van-cell-group>

        <!-- 复核情况 -->
        <van-cell-group>
          <van-cell title="复核情况" class="bg_grey" />

          <van-cell title="违规复核" :value="wgfh"></van-cell>
          <van-cell title="违规责任人" :value="zrr"></van-cell>
          <van-cell title="复核处理说明" :value="fhclsm"></van-cell>
          <van-cell title="复核人" :value="fhr"></van-cell>
          <van-cell title="复核时间" :value="fhsj"></van-cell>

        </van-cell-group>
      </van-col>
    </van-row>

  </div>
</template>

<script>
/**
 * 用车记录详情页
 */

export default {
  data() {
    return {
      violation: {},
      cph: '',
      vin: '',
      ly: '',
      jg: '',
      syr: '',
      sjh: '',
      wgfh: '',
      zrr: '',
      fhclsm: '',
      fhr: '',
      fhsj: ''
    };
  },
  mounted() {
    this.violation = this.$store.state.violation;
    this.initData();
  },
  methods: {
    initData() {
      this.cph = this.violation.vehicleInfo.plateNum;
      this.vin = this.violation.vehicleInfo.vinNo;
      this.ly = this.violation.violationSource === 1 ? "人为使用" : "硬件检测";
      this.jg = this.violation.company.companyName;
      this.syr = this.violation.company.userName;
      this.sjh = this.violation.company.mobile;
      this.wgfh = this.wgfhEnum(this.violation.violationType);
      this.zrr = this.violation.ResponsiblePerson !== null ? this.violation.ResponsiblePerson : '';
      this.fhclsm = this.violation.approveMemo !== null ? this.violation.approveMemo : '';
      this.fhr = this.violation.approveUser !== null ? this.violation.approveUser : '';
      this.fhsj = this.violation.approveTime !== null ? this.$moment(this.violation.approveTime) : '';
    },
    back() {
      this.$router.push("/carUsage/reviewViolations");
    },
    wgfhEnum(code) {
      switch(code) {
        case 1:
          return '超时违规';
        case 2:
          return '出围栏违规';
        case 3:
          return '进围栏违规';
        case 4:
          return '超速违规';
        case 5:
          return '非法用车违规';
        case 6:
          return '轨道偏离';
        case 7:
          return '设备离线';
        case 8:
          return '电压过低';
        case 9:
          return '异常启动';
        case 10:
          return '异常位移';
      }
    }
  },
};
</script>

<style scoped>
.van-cell .van-cell__title {
  min-width: 30%;
}
.van-cell .van-cell__value {
  min-width: 70%;
}
</style>
